<template>
	<view class="page">
		<view class="flex0">
			<u-navbar :fixed='false' bgColor="transparent" @leftClick="navBack"  title="心理辅导预约">
				<view slot="center" class="navTitle">
					心理辅导预约 
				</view>
			</u-navbar>
		</view>
		
		<view class="flex1">
			<scroll-view scroll-y="true" class="scrollView pt30">
				<div class="pbanner pd30" v-if="info.banner">
					<view class="banIn" @tap="openUrl(info.banner.link)">
						<image :src="info.banner.image" mode="widthFix"></image>
					</view>
				</div>
				<view class="expertList pd30" v-if="info.list">
					<view class="item" v-for="(i,index) in info.list" :key="index">
						<view class="img">
							<image :src="i.image" mode="aspectFill"></image>
						</view>
						<view class="in">
							<view class="tag" :class="i.type==0?'':'s2'">
								<text>{{i.tag}}</text>
								<view class="sd">
									<image src="@/static/images/roundl.png" mode="aspectFill"></image>
								</view>
							</view>
							<view class="im">
								<view class="il">
									<view class="it">
										<text class="n">{{i.name}}</text>
										<text>{{i.position}}</text>
									</view>
									<view class="ip">
										{{i.desc}}
									</view>
								</view>
								<view class="ir">
									<view class="btn" @tap="openAppoint(i.id)">
										立即预约
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info:{}
			}
		},
		methods: {
			openAppoint(id){
				uni.navigateTo({
					url:'/subpage/appointment/form?id='+id
				});
			},
			getInfo(){
				var that=this;
				var res={
					banner:{
						image:'../../static/upload/exbanner.jpg',
						link:''
					},
					list:[
						{
							id:101,
							name:"李浩楠",
							type:0,
							position:'心理专职教师',
							image:'../../static/upload/exp1.png',
							desc:'学校专职心理辅导老师，帮助学生解决问题',
							tag:'校内心理辅导专职教师'
						},
						{
							id:101,
							name:"陈昭姐",
							type:0,
							position:'心理专职教师',
							image:'../../static/upload/exp2.png',
							desc:'学校专职心理辅导老师，帮助学生解决问题',
							tag:'校内心理辅导专职教师'
						},
						{
							id:101,
							name:"林月如",
							type:1,
							position:'心理专家',
							image:'../../static/upload/exp3.png',
							desc:'擅长抑郁焦虑/失眠/压力疏导/亲子教育等等',
							tag:'学校合作心理专家'
						}
					]
				};
				that.info=res;
			}
		},
		mounted(){
			this.getInfo();
		}
	}
</script>

<style lang="scss" scoped>
	.pbanner{
		margin-bottom: 10rpx;
		.banIn{
			border-radius: 30rpx;
			overflow: hidden;
			image{
				display: block;
				width: auto;
				height: auto;
			}
		}
	}
	
</style>
